<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"/>
<meta content="yes" name="apple-mobile-web-app-capable"/>
<meta content="black" name="apple-mobile-web-app-status-bar-style"/>
<title>绑定手机</title>
<script src="js/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="js/util.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
	<section class="bind-phone">
		<p class="tips">您还未完成绑定手机，完成绑定手机，即可首次关注赠送10.0M流量！</p>
		<form class="form-wrap">
			<div class="row">
				<label>请输入手机号码</label>
				<input type="text" name="tel"/>
			</div>
			<div class="row">
				<label>请输入验证码</label>
				<div class="validate-code">
					<span class="btn btn-normal jq-validate">发送验证码</span>
					<div>
						<input type="text" name="code"/>
					</div>
				</div>
			</div>
			<p class="btn-wrap"><span class="btn btn-primary jq-bind">绑定手机</span></p>
			<p class="note">（本公众号流量只赠送江西手机号码）</p>
		</form>
	</section>
	<div class="overlay"></div>
	<div class="tips-pop">
		<p></p>
	</div>
	<div class="dialog-modal">
		<div>
			<div class="dialog-header">
				<h2>绑定手机</h2>
				<span class="dialog-close"></span>
			</div>
			<div class="dialog-content">
				<div class="vc-wrap">
					<p class="tips">是否确认绑定此号码?</p>
				</div>
			</div>
			<div class="dialog-footer">
				<span class="btn btn-normal jq-comfirm">确认</span><span class="btn btn-normal jq-cancle">取消</span>
			</div>
		</div>
	</div>

	<script type="text/javascript">
		$(document).ready(function(){
			$('.jq-validate').on('click',function(){
				if(!!!this.interval) {
					$(this).trigger('countDown');
				}
			}).bind('countDown', function() {
				var that = this;
				$(that).prop('disabled', true);
				that.count = 100;
				$(that).text('（' + that.count + 's）');
				that.interval = window.setInterval(function() {
					if(that.count == 1) {
						window.clearInterval(that.interval);
						delete that.interval;
						$(that).prop('disabled', false).text('发送验证码');
						return;
					} else {
						that.count--;
						$(that).text('（' + that.count + 's）');
					}
				}, 1000);
			});
			$('.jq-bind').on('click',function(){
				$('.dialog-modal').mobDialog();
			});
			$('.jq-cancle,.dialog-close').on('click',function(){
				$('.dialog-modal').mobDialog('close');
			});
			$('.jq-comfirm').on('click',function(){
				$('.dialog-modal').mobDialog('close');
				$.mobAlert('绑定成功,您已获取首次绑定X.XM流量');
			});
		});
	</script>
</body>
</html>